<template>
  <div class="bigbox">
    <div class="leftbox">
     <!-- 树节点过滤 -->
      <div>
        <el-input
          placeholder="输入关键字进行过滤"
          size="small"
          v-model="filterText"
        >
        </el-input>
      </div>
      <!-- 树组件 -->
      <div class="tree">
        <el-tree
          ref="tree"
          :props="props"
          :highlight-current="true"
          @node-click="handleNodeClick"
          :filter-node-method="filterNode"
          :load="loadNode"
          lazy>
        </el-tree>
      </div>
    </div>
    <div class="rightbox">
      <div class="arrleftbox">
        <div class="tabletopbox">
          <div class="title">
            <div>部门列表</div>
            <div><button @click="addbumen"><i class="el-icon-plus"></i>新增部门</button></div>
          </div>
          <div class="table" style="height: 88%;">
            <el-table
              ref="table"
              :data="tableDatabumen"
              border
              :header-cell-style="{'text-align':'center',background:'#f5f5f5'}"
              v-loading="loadingbumen"
              height="calc(100% - 1px)"
              highlight-current-row
              @current-change="handleCurrentChangebumen"
              style="width: 100%">
              <el-table-column
                label="序号"
                type="index"
                width="50">
              </el-table-column>
              <el-table-column
                property="orgNo"
                label="部门编码">
              </el-table-column>
              <el-table-column
                property="orgName"
                label="部门名称">
              </el-table-column>
              <el-table-column
                property="address"
                align="center"
                label="操作">
                <template #default="{row}">
                  <i @click="putbumen(row)"  class="el-icon-edit" style="color:#1a90fe ;margin-right: 20px; cursor: pointer;"></i>
                  <i @click="delbumen(row)"  class="el-icon-delete" style="color: red;cursor: pointer;margin-right: 20px;"></i>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <el-divider></el-divider>
        <div class="tablebuttombox">
          <div class="title">
            <div>人员列表</div>
            <div><button @click="addrenyuan"><i class="el-icon-plus"></i>新增人员</button></div>
          </div>
          <div class="table" style="height: 88%;">
            <el-table
              ref="singleTable"
              :data="tableDatarenyuen"
              border
              :header-cell-style="{'text-align':'center',background:'#f5f5f5'}"
              v-loading="loadingrenyuan"
              height="calc(100% - 1px)"
              highlight-current-row
              @current-change="handleCurrentChangerenyuan"
              style="width: 100%">
              <el-table-column
                label="序号"
                type="index"
                width="50">
              </el-table-column>
              <el-table-column
                property="userName"
                label="人员名称">
              </el-table-column>
              <el-table-column
                property="userNo"
                label="人员账号">
              </el-table-column>
              <el-table-column
                property="address"
                align="center"
                width="200"
                label="操作">
                <template #default="{row}">
                  <el-tooltip class="item" effect="dark" content="修改用户信息" placement="top">
                    <i  @click="xiugairenyuan(row)" class="el-icon-edit" style="color:#1a90fe ;margin-right: 15px; cursor: pointer;"></i>
                  </el-tooltip>
                  <el-tooltip class="item" effect="dark" content="修改用户密码" placement="top">
                    <i  @click="putpassword(row)" class="el-icon-edit-outline" style="color:#1a90fe ;cursor: pointer;margin-right: 15px;"></i>
                  </el-tooltip>
                  <el-tooltip class="item" effect="dark" content="用户解锁" placement="top">
                    <i v-show="row.locked" @click="changstatus(row)" class="iconfont icon-jiesuo" style="color: #25fe45;cursor: pointer;margin-right: 15px;"></i>
                  </el-tooltip>
                  <el-tooltip class="item" effect="dark" content="用户锁定" placement="top">
                    <i v-show="!row.locked" @click="tolock(row)" class="iconfont icon-suoding" style="color: red;cursor: pointer;margin-right: 15px;"></i>
                  </el-tooltip>
                  <el-tooltip class="item" effect="dark" content="删除" placement="top">
                    <i  @click="delyonghu(row)" class="el-icon-delete" style="color: red;cursor: pointer;"></i>
                  </el-tooltip>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <el-dialog
            title="用户锁定"
            :visible.sync="dialogVisiblesuodin"
            width="30%">
            <span><el-input v-model="reason" size="small" placeholder="请输入锁定原因"></el-input></span>
            <span slot="footer" class="dialog-footer">
              <el-button class="button" @click="lockquxiao" >取 消</el-button>
              <el-button class="button sure" type="primary" @click="locksubmit" size="small">确 定</el-button>
            </span>
          </el-dialog>
        </div>
      </div>
      <div class="arrrightbox">
        <div class="newstytem">
            <template>
              <el-tabs v-model="activeName" >
                <el-tab-pane label="角色配置" name="first">
                    <div v-for="item in checklist" :key="item.id">
                      <div class="title">{{ item.name }}</div>
                      <div>
                        <el-checkbox-group v-model="roleIds" @change="baocuochick">
                          <el-checkbox v-for="(item,index) in item.roles" :key="index" :label="item.id" :name="item.id">
                            {{ item.name }}
                          </el-checkbox>
                        </el-checkbox-group>
                      </div>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="功能权限配置" name="second">
                  <div class="gongnneg" style="height: 100%;">
                        <el-tabs v-model="activeNamenei" >
                          <!-- 循环第一层系统功能 -->
                          <el-tab-pane v-for="(item,index) in modules" :key="index" :label="item.name" :name="item.id">
                            <!-- 循环第二层功能权限 -->
                            <div v-for="(item,index) in item.packages" :key="index">
                              <div class="taxt">{{ item.name }}</div>
                              <div>
                                <!-- 循环第三层页面/功能 -->
                                <el-checkbox-group v-model="checkedCities" @change="baocuochick">
                                  <el-checkbox v-for="(item,index) in item.functions" :label="item.id" :key="index" >
                                    {{item.name}}
                                  </el-checkbox>
                                </el-checkbox-group>
                              </div>
                            </div>
                          </el-tab-pane>
                        </el-tabs>
                      </div>
                </el-tab-pane>
              </el-tabs>
            </template>
        </div>
        <div class="newstytem usermenu" ref="usermenurefs">
          <div class="taxt">菜单方案配置</div>
          <el-checkbox-group v-model="userdefault" @change="inputmenu">
            <div v-for="item in menulist" :key="item.menuId">
              <el-checkbox :label="item.menuId">{{item.menuName}}</el-checkbox>
            </div>
          </el-checkbox-group>
          <!-- <el-radio-group v-model="userdefault" @input="inputmenu">
            <div v-for="item in menulist" :key="item.menuId">
              <el-radio  :label="item.menuId" >{{item.menuName}}</el-radio>
            </div>
          </el-radio-group> -->
        </div>
      </div>
      <!-- 新增部门弹窗 -->
      <div class="dialog">
        <el-dialog
        title="部门信息"
        :visible.sync="dialogVisible"
        width="30%">
        <div >
          <el-form :model="bumenform" label-position="right" label-width="100px">
            <el-row>
              <el-col :span="24">
                <el-form-item label="上级机构">
                  <el-input v-model="bumenform.name" size="small" placeholder="请输入上级机构" :disabled="true"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="部门名称">
                  <el-input v-model="bumenform.deptName" size="small" placeholder="请输入部门名称"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button class="button" @click="bumenquxiao">取 消</el-button>
          <el-button class="button sure" type="primary" @click="bumensure">确 定</el-button>
        </span>
      </el-dialog>
      </div>
      <!-- 修改密码弹窗 -->
      <div class="dialog">
        <el-dialog
          title="密码修改"
          :visible.sync="dialogVisibles"
          width="30%">
          <div>
            <el-form :model="passwordform" label-position="right" label-width="100px">
              <el-row>
                <el-col :span="24">
                  <el-form-item label="用户账号">
                    <el-input v-model="passwordform.userNo" size="small" placeholder="请输入用户账号" :disabled="true"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="新密码">
                    <el-input v-model="passwordform.password" size="small" placeholder="请输入新密码" show-password></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="确认密码">
                    <el-input v-model="passwordform.confirmPassword" size="small" placeholder="请再次输入确认密码" show-password></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button class="button" @click="passwordquxiao">取 消</el-button>
            <el-button class="button sure" type="primary" @click="surepassword">确 定</el-button>
          </span>
        </el-dialog>
      </div>
      <!-- 新增人员信息 -->
      <div class="dialog">
        <el-dialog
          title="人员信息"
          :visible.sync="dialogVisibleren"
          @close="renyuanquxiao"
          width="30%">
          <div>
            <el-form :model="renyuanform" label-position="right" label-width="120px">
              <el-row>
                <el-col :span="24">
                  <el-form-item label="用户账号">
                    <el-input v-model="renyuanform.userNo" :disabled="renyuanform.userId?true:false" size="small" placeholder="请输入用户账号" ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="用户名称">
                    <el-input v-model="renyuanform.userName" size="small" placeholder="请输入用户名称" ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="用户过期时间">
                    <el-date-picker style="width: 100%;" v-model="renyuanform.expireTime" type="date" placeholder="选择日期" size="small" value-format="yyyy-MM-dd"></el-date-picker>
                  </el-form-item>
                </el-col> 
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="所属组织机构">
                    <el-input v-model="renyuanform.orgName" size="small" placeholder="请输所属组织机构" ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="是否自动解锁">
                    <el-switch v-model="renyuanform.autoUnlock"></el-switch>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button class="button" @click="renyuanquxiao">取 消</el-button>
            <el-button class="button sure" type="primary" @click="surerenyuan">确 定</el-button>
          </span>
        </el-dialog>
      </div>
      <!-- 修改部门信息 -->
      <div class="dialog">
        <el-dialog
          title="提示"
          :visible.sync="xiugaibumenVisible"
          width="30%">
          <div>
            <el-form :model="xiubuform" label-position="right" label-width="100px">
              <el-row>
                <el-col :span="24">
                  <el-form-item label="名称">
                    <el-input v-model="xiubuform.orgName" size="small" placeholder="请输入名称"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
              <el-col :span="24">
                <el-form-item label="编码">
                  <el-input v-model="xiubuform.orgNo" size="small" placeholder="请输入编码" ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="企业识别码">
                  <el-input v-model="xiubuform.identityCode" size="small" placeholder="请输入编码" ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button class="button" @click="bumendisquxiao">取 消</el-button>
            <el-button class="button sure" type="primary" @click="bumendiasure">确 定</el-button>
          </span>
        </el-dialog>
      </div>
    </div>
  </div>
</template>

<script>
import {
  getgenjieapi, getyewuzhuzhiapi, getxiajixinzhenapi, postbumenapi, putbumenapi, delbumenapi, getrenyuanlistapi,postjiesuoyonghuapi,
  putpasswordapi, delyonghuapi, addyonghuapi, putrenyuanapi, getthiskeshouapi, getthisgongnengapi, getyishougobgnengapi,postsuodingyonghuapi,
  getyishoujueseapi, postjueseshouapi, postgongnshouapi, posthuishougongnapi, posthuishoujueseapi, getuservalwapi,
getkeyusermenuapi,postgrantuserapi,deletegrantuserapi} from '@/api/prwpaid/configura/ccb'
export default {
  name: 'CallPoliceIndex',

  data() {
    return {
      activeNamenei:'',
      roleIds:[],
      xiubuform:{},
      xiugaibumenVisible:false,
      renyuanform:{autoUnlock:true},
      dialogVisibleren:false,
      passwordform:{userId:''},
      dialogVisibles:false,
      bumenform:{},
      dialogVisible:false,
      loadingbumen:false,
      tableDatabumen: [],
      tableDatarenyuen: [],
      loadingrenyuan:false,
      filterText: '',
      props: {
        label: 'bizOrgName',
        disabled: 'disabled'
      },
      treevalue: {},
      bumenflag: false,
      bumenvalue: {},
      checklist: [],
      activeName: 'first',
      modules: [],
      checkedCities: [],
      renyuanvalue: {},
      huigonglist: [],
      huijuelist:[],
      reason: '',
      dialogVisiblesuodin:false,
      tolockuser:{},
      menulist: [],
      userdefault:[]
    };
  },

  async mounted() {
    const {data:{entity:{types}}} = await getthiskeshouapi()
    this.checklist = types
    const {data:{entity:{modules}}} = await getthisgongnengapi()
    this.modules = modules
    const { data: { list } } = await getuservalwapi()
    this.menulist=list
    this.activeNamenei = this.modules[0].id
  },

  methods: {
    // 权限保存按钮
    async baocuochick() {
      if (!this.renyuanvalue.userId) return this.$message.warning('请先选择用户')
      // 该用户原有角色权限和现有角色权限做对比拿到取消后的权限点
      const newArr = this.huijuelist.filter((item) => !this.roleIds.includes(item));
      // 拿到后的角色权限点如果为空则不执行回收权限接口
      if (newArr.length) await posthuishoujueseapi({ roleId: newArr.join(','), userId: this.renyuanvalue.userId })
      // 现有角色权限如果为空则不执行授权接口
      if (this.roleIds.length) {
        await postjueseshouapi({ roleId: this.roleIds.join(','), userId: this.renyuanvalue.userId })
      }
      // 该用户原有功能权限和现有功能权限做对比拿到取消后的权限点
      const newArray = this.huigonglist.filter((item) => !this.checkedCities.includes(item));
      // 拿到后的功能权限点如果为空则不执行回收权限接口
      if (newArray.length) await posthuishougongnapi({ functionId: newArray.join(','), userId: this.renyuanvalue.userId })
      // 现有功能权限如果为空则不执行授权接口
      if (this.checkedCities.length) {
        await postgongnshouapi({ functionId: this.checkedCities.join(','), userId: this.renyuanvalue.userId })
      }
      this.$message.success('操作成功')
      // 刷新权限接口
      this.getjuequan(this.renyuanvalue.userId)
    },
    // 用户解锁
    async changstatus(val) {
      this.$confirm('此操作将为该用户解锁, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          await postjiesuoyonghuapi({ userId: val.userId }).then(res => {
            this.$message({
              type: res.code == '200' ? 'success' : 'warning',
              message: res.message
            })
            this.getrenyuanlist(this.bumenvalue.orgNo)
          })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消解锁'
          })
        })
    },
    // 用户锁定
    tolock(row) {
      this.tolockuser=row
      this.dialogVisiblesuodin=true
    },
    // 用户锁定弹窗取消
    lockquxiao() {
      this.reason=''
      this.dialogVisiblesuodin=false
    },
    // 用户锁定弹窗确认
    async locksubmit() {
      await postsuodingyonghuapi({ userId: this.tolockuser.userId, reason: this.reason }).then(res => {
        this.$message({
          type: res.code == '200' ? 'success' : 'warning',
          message: res.message
        })
        this.getrenyuanlist(this.bumenvalue.orgNo)
      })
      this.lockquxiao()
    },
    // 清空角色/功能权限数组
    delarray() {
      this.checkedCities = []
      this.roleIds=[]
    },
    // 人员表格点击
    async handleCurrentChangerenyuan(row) {
      this.renyuanvalue = row
      this.getjuequan(row.userId)
      this.getuserview(row.userId)
    },
    // 获取人员菜单
    async getuserview(userId) {
      const loading = this.$loading({
        lock: true,
        text: 'loading',
        spinner: 'el-icon-loading',
        target: this.$refs.usermenurefs
      });
      const {data:{list}} = await getkeyusermenuapi({ userId })
      this.userdefault=list
      loading.close()
    },
    // 人员菜单单选
    async inputmenu(val) {
      if (!this.renyuanvalue.userId) {
        this.userdefault=[]
        return this.$message.warning('请先选择用户')
      }
      if (!val.length) {
        deletegrantuserapi(val[0], this.renyuanvalue.userId).then(res => {
          this.$message({
            type: res.code == '200' ? 'success' : 'warning',
            message:res.code=='200'?'删除用户菜单授权成功':res.message
          })
          this.getuserview(this.renyuanvalue.userId)
        }).catch(err => {
            this.getuserview(this.renyuanvalue.userId)
          })
      } else {
          this.userdefault = [val[val.length - 1]]
          postgrantuserapi(val[val.length - 1], this.renyuanvalue.userId).then(res => {
            this.$message({
              type: res.code == '200' ? 'success' : 'warning',
              message:res.code=='200'?'创建用户菜单授权成功':res.message
            })
            this.getuserview(this.renyuanvalue.userId)
          }).catch(err => {
            this.getuserview(this.renyuanvalue.userId)
          })
      }
    },
    // 获取角色页面权限
    async getjuequan(val) {
      const {data:{list}} = await getyishougobgnengapi({ userId:  val})
      this.checkedCities = list.map(ele => ele.functionId)
      this.huigonglist=this.checkedCities
      const res = await getyishoujueseapi({ userId: val })
      this.roleIds = res.data.list.map(ele => ele.roleId)
      this.huijuelist=this.roleIds
    },
    // 修改人员
    xiugairenyuan(row) {
      console.log(row);
      this.dialogVisibleren=true
      this.renyuanform = { ...row }
      this.$set(this.renyuanform,'orgName',this.bumenvalue.orgName)
    },
    // 新增用户弹窗确定
    async surerenyuan() {
      try {
        this.renyuanform.userId ?
        await putrenyuanapi({ ...this.renyuanform, deptNo: this.bumenvalue.orgNo }).then(res => {
          if (res.code == '200') {
          this.$message.success('修改成功')
         }
         })
       : await addyonghuapi({ ...this.renyuanform, deptNo: this.bumenvalue.orgNo }).then(res => {
        if (res.code == '200') {
          this.$message.success('新增成功')
        }
      })
      } catch (error) {
        
      }
      this.renyuanquxiao()
      this.getrenyuanlist(this.bumenvalue.orgNo)
    },
    // 删除用户
    delyonghu(row) {
      this.$confirm('此操作将注销该用户, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          await delyonghuapi({ userId: row.userId }).then(res => {
            if (res.code == '200') {
              this.$message.success('删除成功')
            }
          })
          this.getrenyuanlist(this.bumenvalue.orgNo)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },
    // 人员弹窗取消
    renyuanquxiao() {
      this.renyuanform={autoUnlock:true}
      this.dialogVisibleren=false
    },
    // 新增人员
    addrenyuan() {
      if(!this.bumenvalue.orgNo) return this.$message.warning('请先选择部门')
      this.dialogVisibleren = true
      this.$set(this.renyuanform,'orgName',this.bumenvalue.orgName)
    },
    // 新增部门
    addbumen() {
      if(!this.treevalue.bizOrgNo) return this.$message.warning('请先选择组织机构')
      this.dialogVisible = true
      this.$set(this.bumenform,'name',this.treevalue.bizOrgName)
    },
    // 部门弹窗确定
    async bumensure() {
       try {
        await postbumenapi({
        deptName: this.bumenform.deptName,
        deptType: '60',
        parentNo:this.treevalue.bizOrgNo
       }).then(ele => {
         if (ele.code == '200') {
          this.$message.success('新增成功')
        }
       })
       } catch (error) {
        
       }
      this.getbumenlist(this.treevalue.bizOrgNo)
      this.bumenquxiao()
    },
    // 部门修改确定
    async bumendiasure() {
      await putbumenapi(this.xiubuform).then(res => {
        if (res.code == '200') {
          this.$message.success('修改成功')
        }
      })
      this.getbumenlist(this.treevalue.bizOrgNo)
      this.bumendisquxiao()
    },
    // 部门修改取消
    bumendisquxiao() {
      this.xiugaibumenVisible = false
      this.xiubuform={}
     },
    // 部门修改
    putbumen(row) {
      this.bumenflag=true
      this.xiugaibumenVisible = true
      this.$set(this.xiubuform,'orgName',row.orgName)
      this.$set(this.xiubuform,'orgNo',row.orgNo)
      this.$set(this.xiubuform,'identityCode',row.identityCode)
    },
    // 部门删除
    delbumen(row) {
      this.$confirm('此操作将注销该用户, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          await delbumenapi({ orgNo: row.orgNo }).then(res => {
            if (res.code=='200') {
              this.$message.success('删除成功')
            }
          })
          this.getbumenlist(this.treevalue.bizOrgNo)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },
    // 部门弹窗取消
    bumenquxiao() {
      this.bumenflag=false
      this.dialogVisible = false
      this.bumenform.deptName=''
    },
    // 部门表格点击
    handleCurrentChangebumen(value) {
      this.delarray()

      this.bumenvalue=value
      this.getrenyuanlist(value.orgNo)
    },
    //修改密码弹窗确认
    async surepassword() {
      try {
        const res = await putpasswordapi(this.passwordform)
        if (res.code=='200') {
            this.$message.success('修改成功')
        }
      } catch (error) {
        
      }
      this.passwordquxiao()
      this.getrenyuanlist(this.bumenvalue.orgNo)
    },
    // 修改密码弹窗取消
    passwordquxiao() {
      this.passwordform={userId:''}
      this.dialogVisibles=false
    },
    // 修改密码
    putpassword(row) {
      console.log(row);
      this.dialogVisibles = true
      this.passwordform.userNo=row.userNo
      this.passwordform.userId=row.userId
    },

    //获取人员表列表
    async getrenyuanlist(val) {
      this.loadingrenyuan=true
      const res = await getrenyuanlistapi({deptNo:val})
      this.tableDatarenyuen=res.data.list
      this.loadingrenyuan=false
      if(!res.data.list.length) return
      // this.handleCurrentChangerenyuan(res.data.list[0])
      this.$refs.singleTable.setCurrentRow(res.data.list[0])
    },
       // 树节点点击
    async handleNodeClick(val) {
      this.treevalue=val
      this.getbumenlist(val.bizOrgNo)
      // this.tableDatarenyuen = []
      this.delarray()
    },
    // 获取部门表格数据
    async getbumenlist(val) {
      this.loadingbumen=true
      const res = await getxiajixinzhenapi({ parentOrgNo: val })
      this.tableDatabumen = res.data.list
      this.loadingbumen=false
      if(!res.data.list.length) return
      this.$refs.table.setCurrentRow(res.data.list[0])
      // this.getrenyuanlist(res.data.list[0].orgNo)
    },
   // 树节点过滤
    filterNode(value, data) {
      if (!value) return true
      return data.bizOrgName.indexOf(value) !== -1
    },
   // 树组件懒加载
    async loadNode (node, resolve) {

        const res = await getgenjieapi()
        if (node.level === 0) {
          // 初始的级数（最顶层）
          return resolve(res.data.list) // 最顶层数据渲染为region
        }
        const ress = await getyewuzhuzhiapi({ parentOrgNo: node.data.bizOrgNo })
        if (node.level >= 1) {
          return resolve(ress.data.list)
        }
    },
  },
  watch: {
    filterText (val) {
      this.$refs.tree.filter(val)
    }
  }
};
</script>

<style scoped>
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.bigbox{
  padding: 10px;
  height: 100%;
  display: flex;
  .leftbox{
    width: 300px;
  height: 100%;
  padding: 20px;
  background-color: #fff;
  .tree{
   margin-top: 15px;
   height: 95%;
   overflow: hidden;
   overflow-y: auto;
   }
  }
  .rightbox{
    width: calc(100% - 310px);
    background-color: #fff;
    padding: 20px;
    margin-left: 10px;
    display: flex;
    .arrleftbox{
      /* border-right: 1px solid #ccc; */
      width: 50%;
      height: 100%;
      padding-right: 20px;
      .tabletopbox{
        border: 1px solid #ccc;
        width: 100%;
        height: 48%;
        margin-bottom: 10px;
        padding: 10px;
        .title{
          display: flex;
          justify-content: space-between;
          margin-bottom: 10px;
          button{
            width: auto;
            padding: 0 10px;
            height: 30px;
            background-color: #3b8eea;
            color: #fff;
            border-radius: 3px;
            border: none;
          }
        }
      }
      .tablebuttombox{
        border: 1px solid #ccc;
        width: 100%;
        height: 49.5%;
        margin-top: 10px;
        padding: 10px;
        .title{
          display: flex;
          justify-content: space-between;
          margin-bottom: 10px;
          button{
            width: auto;
            padding: 0 10px;
            height: 30px;
            background-color: #3b8eea;
            color: #fff;
            border-radius: 3px;
            border: none;
          }
        }
      }
    }
    .arrrightbox{
      border: 1px solid #ccc;
      width: 50%;
      padding:0 10px;
      height: 100%;
      .newstytem{
        height: 50%;
      }
      .usermenu{
        border-top: 1px solid #ccc;
        padding-top: 10px;
        ::v-deep .el-radio{
          margin-top: 20px;
        } 
        overflow-y: auto;
      }
      .title{
        font-weight: 600;
      }
      .gongnneg{
        height: 100%;
        overflow: hidden;
        overflow-y: auto;
      }
      .taxt{
          font-weight: 600;
        }
      .align{
        text-align: center;
        .button{
          width: 60px;
            height: 30px;
            background-color: #3b8eea;
            color: #fff;
            border-radius: 3px;
            border: none;
        }
      }
    }
    .dialog{
      .button{
        width: 60px;
        height: 30px;
        border-radius: 3px;
        border: 1px solid #ccc;
        background-color: #fff;
        margin-left: 10px;
      }
      .sure{
        color: #fff;
        background-color: #3b8eea;
      }
    }
  }
}
.button{
        width: 60px;
        height: 30px;
        border-radius: 3px;
        border: 1px solid #ccc;
        background-color: #fff;
        margin-left: 10px;
      }
      .sure{
        color: #fff;
        background-color: #3b8eea;
      }
::v-deep .el-dialog__footer{
  text-align: center;
}
::v-deep .dialog-footer{
  margin-top: 20px;
}
::v-deep .el-checkbox{
  width: 33%;
  margin: 10px 0;
}
::v-deep .el-tabs{
  height: 95%;
}
::v-deep .el-tabs__content{
  height: 85%;
}
::v-deep .el-tab-pane{
  height: 100%;
  overflow: hidden;
 overflow-y: auto;
}
</style>